"use strict";
import * as React from 'react';
import { commonProps, commonStyles } from "../../assets/styles/common";
const { View, FlatList } = require('react-native');
const { connect } = require('react-redux');
const NavigationBar = require('react-native-navbar').default;
const { Actions } = require("react-native-router-flux");
import Colors from "../../assets/styles/Colors";
import NavBackButton from "../../component/BackButton";
import NoticeItem from "../../component/NoticeItem";
import Line from "../../component/Line";
class Page extends React.Component {
    constructor(props, context) {
        super(props, context);
        this.onRefresh = () => {
            this.setState({
                refreshing: true,
                title: '正在加载...'
            });
            setTimeout(() => {
                this.setState({
                    refreshing: false,
                    title: '通知'
                });
            }, 1000);
        };
        this.onItemPress = (item) => {
            this.props.dispatch({
                type: 'message/readMessage',
                payload: Object.assign({}, item)
            });
            Actions.chat({
                title: item.nickname,
                receiver: item.username
            });
        };
        this.renderItem = (props) => {
            const item = props.item;
            return <NoticeItem item={item} onPress={this.onItemPress.bind(this, item)}/>;
        };
        this.state = {
            title: '正在加载...',
            refreshing: true,
        };
    }
    componentDidMount() {
        this.onRefresh();
    }
    render() {
        return (<View style={[commonStyles.container, { backgroundColor: Colors.White }]}>
                <NavigationBar {...commonProps.navBar} leftButton={<NavBackButton />} title={{ title: this.state.title, tintColor: Colors.White }}/>
                <FlatList data={this.props.message.list} extraData={this.state} refreshing={this.props.message.loading} onRefresh={this.onRefresh} renderItem={this.renderItem} ItemSeparatorComponent={() => <Line height={0.5}/>} keyExtractor={(item, index) => index}/>

            </View>);
    }
}
export default connect(({ message }) => ({ message }))(Page);
